<template>
  <div class="comment">
    <van-cell size="large">
      <!-- 用户信息 -->
      <template #title>
        <div class="user">
          <img src="@/assets/images/user.png" alt="" />
          <p>满船星河压清梦</p>
        </div>
      </template>
      <template #default>
        <span>
          <van-icon name="good-job-o" />
          26
        </span>
      </template>
      <!-- 下方内容 -->
      <template #label>
        <div>
          <p>我出去跟别人说我的是iPhoneXS就完事了呗</p>
          <span>09-13 15:51</span>
          <van-button type="default" round size="mini">18回复</van-button>
        </div>
      </template>
    </van-cell>
  </div>
</template>

<script>
export default {}
</script>

<style lang="less" scoped>
.comment {
  .van-cell__title {
    flex: 5;
    .user {
      display: flex;
      img {
        width: 35px;
        height: 35px;
        border-radius: 50%;
        margin-right: 5px;
      }
      p {
        color: #4c6f9f;
        font-size: 14px;
      }
    }
  }
  .van-cell__label {
    margin-left: 50px;
    color: #393939;
    span {
      margin-right: 10px;
    }
  }
}
</style>
